<!DOCTYPE html>
<style>
  html {
    font: 16px sans-serif;
    color: #333;
  }
  div {
    top: 40%;
    left: 0;
    right: 0;
    position: absolute;
    text-align: center;
  }
  button a {
    text-decoration: none;
    color: inherit;
  }
  .soundcleod-error-title {
    font-size: 130%;
  }
  .soundcleod-error-description {
    color: #aaa;
  }
</style>
<script>
  function onTryClick() {
    document.body.innerHTML = ''
  }
</script>
<body>
  <div>
    <p class="soundcleod-error-title">
      <span class="soundcleod-app-name"></span> failed to connect to
      soundcloud.com :(
    </p>
    <p class="soundcleod-error-description"></p>
    <p>
      <button onclick="onTryClick()">
        <a href="https://soundcloud.com">Try again</a>
      </button>
    </p>
  </div>
  <script>
    document.querySelector(
      '.soundcleod-error-description'
    ).textContent = new URL(location.href).searchParams.get('error')
    document.querySelector('.soundcleod-app-name').textContent = new URL(
      location.href
    ).searchParams.get('appName')
  </script>
</body>
